let tempPath = [];
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    signPic:{
      type:String,
      value:''
    },
    visible:{
      type:Boolean,
      value:false,
    }
  },
  options:{
　　multipleSlots: true
  },
  /**
   * 组件的初始数据
   */
  data: {
    showCanvas: true,
    colorBlocks: ['#FF0000', '#FF4081', '#FFA000', '#FFEB3B', '#00BCD4', '#2196F3', '#9E9E9E', '#000000'],
    color: '#000000',
    strokeWidth: 6,
    ctx: null,
    timeStamp: -1000,
    paths: [], // 路径二维数组
    tempFilePath: '',
    width:0,
    height:0,
  },
  lifetimes: {
  
    attached: function() {
    },
    ready: function() {
      let ctx = wx.createCanvasContext('canvas-handwriting', this);
      ctx.setFillStyle('#F5CE6F')
      ctx.setFontSize(12)
      ctx.draw()
      this.setData({ctx})
    },
    detached: function() {
    },
  },
  pageLifetimes: {
    show: function() {
    },
    hide: function() {
    },
    resize: function(size) {
    }
  },
  methods: {
    finishDraw: function(callback) {
      var that=this
      wx.canvasToTempFilePath({
        canvasId: 'canvas-handwriting',
        fileType: 'jpg',
        quality: 1.0,
        success(res) {
          that.setData({visible:false})
          typeof callback == "function" && callback(res);
        },
        fail(res) {
          console.error(res)
        }
      }, this)
    },
    addMark(file,width,height,content,callback) {  
      var that = this
      that.setData({visible:true})
      that.setData({width:width,height:height})
      //获取原图片信息
      wx.getImageInfo({
        src: file,
        success: function (res) {
          let ctx = that.data.ctx;
          ctx.setFillStyle('#F5CE6F')
          ctx.drawImage(file, 0, 0, width, height); //先画出图片
          ctx.fillText(content, width/3, height-10);
          ctx.draw(false,function(res){
            that.finishDraw(callback)
          })
          
        }
      })
    },
  }
})